Page({
  data: {
    userId: null,
    userDetails: {}, // 存储后端返回的永久用户详情，包括永久头像URL
    user_name: '',
    phone_number: '',
    sex: '',
    tempAvatarPath: '', // 只用于存储本地选择的临时头像路径，用于上传
    displayAvatarSrc: '' // 用于控制页面上显示的头像图片src
  },

  onLoad: function (options) {
    // 获取从account页面传递过来的userId
    const userId = options.userId;
    if (userId) {
      this.setData({
        userId: userId
      });

      // 直接调用后端API获取最新用户信息，不再从缓存加载
      this.loadUserDetails(userId);

    } else {
      wx.showToast({
        title: '未找到用户ID',
        icon: 'none'
      });
    }
  },

  // 加载用户详细信息 (从后端API)
  loadUserDetails: function (userId) {
    wx.request({
      url: 'http://127.0.0.1:3001/getUserDetails', // 假设后端有获取用户详情的接口
      method: 'GET',
      data: {
        userId: userId
      },
      success: (res) => {
        if (res.data && res.data.success && res.data.userDetails) { // 假设后端返回的数据结构中有success标志和userDetails数据
          const userDetails = res.data.userDetails;
          this.setData({
            userDetails: userDetails,
            user_name: userDetails.user_name || '',
            phone_number: userDetails.phone_number || '',
            sex: userDetails.sex || '',
            tempAvatarPath: '', // 加载成功后清空临时路径
            displayAvatarSrc: userDetails.user_img || '../../images/default_avatar.png' // 初始化页面显示头像为后端返回的地址
          });
          console.log('Loaded user details from API:', userDetails);

        } else {
          wx.showToast({
            title: res.data.message || '获取用户详情失败',
            icon: 'none'
          });
          // 如果API调用失败，清空显示的数据
          this.setData({
            userDetails: {},
            user_name: '',
            phone_number: '',
            sex: '',
            tempAvatarPath: '',
            displayAvatarSrc: '../../images/default_avatar.png' // 清空页面显示头像
          });
        }
      },
      fail: (err) => {
        console.error('获取用户详情请求失败:', err);
        wx.showToast({
          title: '获取用户详情失败',
          icon: 'none'
        });
        // 如果API调用失败，清空显示的数据
        this.setData({
          userDetails: {},
          user_name: '',
          phone_number: '',
          sex: '',
          tempAvatarPath: '',
          displayAvatarSrc: '../../images/default_avatar.png' // 清空页面显示头像
        });
      }
    });
  },

  // 处理输入框变化
  handleInputChange: function (e) {
    const field = e.currentTarget.dataset.field;
    let value = e.detail.value;

    if (field === 'phone_number') {
      // 只保留数字
      value = value.replace(/\D/g, '');
      // 限制长度为11
      if (value.length > 11) {
        value = value.slice(0, 11);
      }
    }

    this.setData({
      [field]: value
    });
  },

  // 选择并预览头像
  changeAvatar: function () {
    wx.chooseMedia({
      count: 1,
      mediaType: ['image'],
      sourceType: ['album', 'camera'],
      success: (res) => {
        const tempFilePath = res.tempFiles[0].tempFilePath;
        this.setData({
          tempAvatarPath: tempFilePath, // 存储临时路径用于上传
          displayAvatarSrc: tempFilePath // 更新页面显示头像为临时路径
        });
        console.log('Selected avatar temp path:', tempFilePath);
      },
      fail: (err) => {
        console.error('选择图片失败:', err);
        wx.showToast({
          title: '选择图片失败',
          icon: 'none'
        });
      }
    });
  },

  // 保存用户详细信息
  saveUserDetails: function () {
    const userId = this.data.userId;
    const phone = this.data.phone_number ? this.data.phone_number.trim() : '';
    const userName = this.data.user_name ? this.data.user_name.trim() : '';

    // 校验用户名不能为空
    if (!userName) {
      wx.showToast({
        title: '用户名不能为空',
        icon: 'none'
      });
      return;
    }

    // 校验手机号
    if (phone !== '') {
      if (/\s/.test(phone)) {
        wx.showToast({
          title: '手机号不能包含空格',
          icon: 'none'
        });
        return;
      }
      if (!/^\d{11}$/.test(phone)) {
        wx.showToast({
          title: '请输入合法的11位手机号',
          icon: 'none'
        });
        return;
      }
    }

    const updatedDetails = {
      user_id: userId,
      user_name: userName,
      phone_number: phone,
      sex: this.data.sex
    };

    // 检查 tempAvatarPath 是否存在，如果存在说明选择了新头像，需要先上传
    if (this.data.tempAvatarPath) {
      this.uploadAvatar(userId, this.data.tempAvatarPath, updatedDetails);
    } else {
      // 如果没有 tempAvatarPath，说明没有选择新头像，直接保存其他信息
      this.updateUserDetails(userId, updatedDetails);
    }
  },

  // 上传头像
  uploadAvatar: function (userId, tempFilePath, updatedDetails) {
    wx.uploadFile({
      url: 'http://127.0.0.1:3001/uploadAvatar', // 假设后端有一个文件上传接口
      filePath: tempFilePath,
      name: 'avatar', // 后端接收文件的字段名
      formData: {
        userId: userId // 可以传递用户ID等额外参数
      },
      success: (res) => {
        const data = JSON.parse(res.data); // 后端返回的数据通常是JSON字符串
        if (data.success) {
          const avatarUrl = data.avatarUrl; // 假设后端返回的图片地址字段名是avatarUrl
          console.log('头像上传成功，地址:', avatarUrl);
          updatedDetails.user_img = avatarUrl; // 将服务器返回的地址添加到更新数据中
          // 继续保存用户其他信息和新的头像地址
          this.updateUserDetails(userId, updatedDetails);
        } else {
          console.error('头像上传失败:', data.message);
          wx.showToast({
            title: data.message || '头像上传失败',
            icon: 'none'
          });
        }
      },
      fail: (err) => {
        console.error('头像上传请求失败:', err);
        wx.showToast({
          title: '头像上传失败',
          icon: 'none'
        });
      }
    });
  },

  // 更新用户详细信息（包括图片地址）
  updateUserDetails: function (userId, updatedDetails) {
    console.log('updateUserDetails 参数：', updatedDetails);
    wx.request({
      url: 'http://127.0.0.1:3001/updateUserDetails', // 调用更新用户详情的后端接口
      method: 'POST',
      header: {
        'content-type': 'application/json'
      },
      data: updatedDetails,
      success: (res) => {
        if (res.data && res.data.success) {
          wx.showToast({
            title: '保存成功',
            icon: 'success',
            duration: 1000,
            success: () => {
              setTimeout(() => {
                wx.reLaunch({
                  url: '/pages/account/account'
                });
              }, 1000);
            }
          });
          // 更新 userDetails 和 displayAvatarSrc
          this.setData({
            userDetails: {
              ...this.data.userDetails,
              ...updatedDetails
            },
            displayAvatarSrc: updatedDetails.user_img + '?t=' + Date.now()
          });
          this.setData({
            tempAvatarPath: ''
          });
        } else {
          wx.showToast({
            title: res.data.message || '保存失败',
            icon: 'none'
          });
        }
      },
      fail: (err) => {
        console.error('保存用户详情请求失败:', err);
        wx.showToast({
          title: '保存失败',
          icon: 'none'
        });
      }
    });
  },

  // 退出登录
  logout: function() {
    wx.showModal({
      title: '提示',
      content: '确定要退出登录吗？',
      success: (res) => {
        if (res.confirm) {
          // 清除存储的用户信息
          wx.removeStorageSync('userId');
          wx.removeStorageSync('userInfo');
          // 跳转到登录页
          wx.reLaunch({
            url: '/pages/login/login'
          });
        }
      }
    });
  }

});